<template>
<!-- 	<image src="../../static/paiming.png" class="zxcxzcdrtry" mode="widthFix"></image>
	<image src="../../static/paiming2.png" class="zxcxzcdrtry ab" mode="widthFix"></image>
	 -->
	 <view class="cxvcxvdfgrtgret">
	 	
	 </view>
	 <view class="kxzczxcrtryr pd pr vertical-center tl">
	 	<view class="pd ">
	 		<view class="">
				<view class="mt20" @tap="hf('jifen')">
					<text class="cxcrtrty">积分明细>></text>
				</view>
	 			<view class="fz60 z3 b mt20">
	 				{{kxcxera}}
	 			</view>
				<view class="mt10 fz24">
					今日新增积分 {{kxcxerb||0}} 分
				</view>
	 		
	 		</view>
	 	</view>
	 	<image src="../../static/jifensr.png" class="cxcxcrtxfgtry" mode="widthFix"></image>
	 </view>
	<view class="pr lxcxzcrtydxdty">
	<!-- 	<view class="pd xcvcxvrtrytyty display-flex">
			<view class="cen vertical-bottom">
				<view class="">
					<view class="pr xgfddgfy">
						<image src="../../static/vxcvfgd2.png" class="xcxcrtryyct" mode="widthFix"></image>
						<view class="xcxzctrrext vertical-center">
							2
						</view>
					</view>
					<view class="">
						<image mode="aspectFill" :src="kxzcdsfsb.headPortrait" class="xcxzcrtrxxryt cz"></image>
					</view>
					<view class="fz30 dian xczcsdfetrt">
						{{kxzcdsfsb.nickname}}
					</view>
					<view class="fz60 ls">
						{{kxzcdsfsb.jifen}}
					</view>
				</view>
			</view>
			<view class="flex-1 vertical-center cen pm40">
				<view class="">
					<view class="pr xgfddgfy">
						<image src="../../static/vxcvfgd1.png" class="xcxcrtryyct" mode="widthFix"></image>
						<view class="xcxzctrrext vertical-center">
							1
						</view>
					</view>
					<view class="">
						<image mode="aspectFill" :src="kxzcdsfsa.headPortrait" class="xcxzcrtrxxryt cz"></image>
					</view>
					<view class="fz30 dian xczcsdfetrt">
						{{kxzcdsfsa.nickname}}
					</view>
					<view class="fz60 ls">
						{{kxzcdsfsa.jifen}}
					</view>
				</view>
			</view>
			<view class="cen vertical-bottom">
				<view class="">
					<view class="pr xgfddgfy">
						<image src="../../static/vxcvfgd3.png" class="xcxcrtryyct" mode="widthFix"></image>
						<view class="xcxzctrrext vertical-center">
							3
						</view>
					</view>
					<view class="">
						<image mode="aspectFill" :src="kxzcdsfsc.headPortrait" class="xcxzcrtrxxryt cz"></image>
					</view>
					<view class="fz30 dian xczcsdfetrt">
						{{kxzcdsfsc.nickname}}
					</view>
					<view class="fz60 ls">
						{{kxzcdsfsc.jifen}}
					</view>
				</view>
			</view>
		</view>
		 -->
		<view class="pd">
		<!-- 	<view class="pd display-flex">
				<view class="kcxcrtyxrtt aa vertical-center cf">
					2
				</view>
				<view class="kcxcrtyxrtt act ab vertical-center cf">
					1
				</view>
				<view class="kcxcrtyxrtt ac vertical-center cf">
					3
				</view>
			</view> -->
			<view class="xcxzcrtreyxr pt40 pl40 pr40 pm40">
				<view class="fz40 cen b  pm20">
					好友排名
				</view>
				<view class="display-flex pt20 pm20" v-for="(sd,idx) in jxcxdf">
					<view class="vertical-center dfdsxcxty fz32">
					{{idx+1}}
					</view>
					<view class=" ml20">
						<image :src="sd.headPortrait" class="cxvcytryudt" mode="aspectFill"></image>
					</view>
					<view class="flex-1 ml20 vertical-center tl ">
						<view class="fz32">
							{{sd.nickname}}
						</view>
						
					</view>
					<view class="fz40 vertical-center ls">
						{{sd.jifen}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script lang="ts" setup>
	import { onLoad } from "@dcloudio/uni-app"
	import { ref } from "vue"
	import { hf, dxrequest, callBack } from "@/util/index.js"
	const jxcxdf = ref([])
	const kxzcdsfsa = ref({})
	const kxzcdsfsb = ref({})
	const kxzcdsfsc = ref({})
	const jxcxfty = ref("")
	const kxcxera = ref("")
	const kxcxerb =ref(0)
	const init = async()=>{
		const {data} = await dxrequest("maya/api/getjifenListdansxer")
		kxcxera.value = data.zjf
		kxcxerb.value = data.kkxcrt
	}
	
	const inixdrt = async()=>{
		uni.showLoading({
			title:"加载中..."
		})
		init()
		const {data} = await dxrequest("maya/api/getuserpaim")
		kxzcdsfsa.value = data[0]
		kxzcdsfsb.value = data[1]
		kxzcdsfsc.value = data[2]
		for(let i=0;i<data.length;i++){
			jxcxdf.value.push(data[i])
		}
		console.log(data)
		uni.hideLoading()
	}
	inixdrt()
	
	
	
	
	
</script>

<style scoped>
	.cxvcxvdfgrtgret{
		position: fixed;
		left: 0;
		top:0;
		width: 100%;
		height: 100%;
		background: linear-gradient(180deg, #FFE08C 6%, #FBDAA2 49%, #C21A1A 77%, #5E0000 103%);
		z-index: 1;
	}
	.zxcxzcdrtry {
		width: 382rpx;
		position: fixed;
		left: -100rpx;
		top: -170rpx;
		z-index: 10;
	}

	.zxcxzcdrtry.ab {
		left: inherit;
		right: -100rpx;
		top: -190rpx;
	}

	.xcvcxvrtrytyty {
		height: 400rpx;
		padding-left: 80rpx;
		padding-right: 80rpx;
	}

	.xgfddgfy {
		display: inline-block;
	}

	.xcxcrtryyct {
		width: 65rpx;
	}

	.xcxzctrrext {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		color: #fff;
		font-size: 24rpx;
	}

	.xcxzcrtrxxryt {
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
		border: 4rpx solid #fff;
	}
	.kcxcrtyxrtt{
		width: 220rpx;
		height: 80rpx;
		border-radius: 20rpx;
		background: #FF3131
	}
	.kcxcrtyxrtt.ab{
		background: #FFD037;
	}
	.kcxcrtyxrtt.ac{
		background: linear-gradient(0deg, #FF8031, #FF8031), #FF5A5A;
	}
	.kcxcrtyxrtt.act{
		transform: scale(1.3);
		position: relative;
		bottom: 10rpx;
		box-shadow: 0px 16px 14px 0px rgba(0, 0, 0, 0.3);
	}
	.xcxzcrtreyxr{
		min-height: 800rpx;
		background: #fff;
		border-radius: 40rpx 40rpx 0 0;
		position: relative;
		z-index: 100;
		top: -10rpx;
	}
	.cxvcytryudt{
		width: 88rpx;
		height: 88rpx;
		border-radius: 50%;
	}
	.dfdsxcxty{
		width: 60rpx;
	}
	.xczcsdfetrt{
		max-width: 200rpx;
	}
</style>